<!--
 * @Date: 2019-11-06 10:43:31
 * @LastEditors: peng qiao
 * @LastEditTime: 2020-02-18 14:33:07
 -->
<template>
  <div class="todo_matter">
    <van-nav-bar
      title="事项办理"
      left-arrow
      @click-left="$router.go(-1)"
      fixed
    />
    <div class="html_box" v-html="url"></div>
    <van-button class="next_btn apply_btn" @click="contact()">申 办</van-button>
    <van-popup v-model="showLoading">
      <van-loading color="#DC4630" />
    </van-popup>
  </div>
</template>

<script>
import api from "@/controller/govService.js";
import constant from "@/controller/constant.js";
export default {
  data() {
    return {
      showLoading: false,
      url: "",
      data: {}
    };
  },
  mounted() {
    this.getServiceDetail();
  },
  methods: {
    getServiceDetail() {
      this.showLoading = true;
      api
        .service_v1_find(this.$route.query.id)
        .then(res => {
          if (res.code === "0") {
            this.url = `<h2 style="text-align:center">${res.datas.serviceName}</h2>${res.datas.description}`;
            this.data = res.datas;
          } else {
            if (res && res.msg) {
              this.$toast(res.msg);
            } else {
              this.$toast(constant.unusualMsg);
            }
          }
        })
        .catch(() => {})
        .then(() => {
          this.showLoading = false;
        });
    },
    contact() {
      this.$router.push({
        name: "applyPage",
        query: this.data
      });
    }
  }
};
</script>

<style lang="scss" scoped>
@import "../../../styles/workstation.scss";

.todo_matter {
  background: #ffffff;
  height: 100%;
  .html_box {
    padding: 15px;
    h1 {
      text-align: center;
    }
  }
}
</style>
